/*
 *  Document   : index.js
 */
var indexWeb = function() {
    var $window = $(window)
        , $flexSlider = $("#banner")
        , $product =  $('#product-tab .latest_carousel_tab, #product-tab' +
            ' .bestseller_carousel_tab')
        , $tabFirst = $("ul#tabs li:first")
        , $tab = $("ul#tabs li")
        , $featured = $('#content .featured_carousel')
        , sliderLast
        , sliderBestSeller
        , sliderFeatured
        , $bandSlider = $('#brandLogo ul');

    /* Initialization slide */
    var initSlider = function () {

       $flexSlider.flexslider({
            animation: "fade"
        });

       $product.flexslider({
            animation: "slide",
            animationLoop: false,
            slideshow: false,
            itemWidth: 210,
            minItems: getGridSize(), // use function to pull in initial value
            maxItems: getGridSize(), // use function to pull in initial value
            controlNav :false,
            start: function (slider) {
                $("#product-tab .tab_content").addClass("deactive");
                $("#product-tab .tab_content:first").removeClass("deactive"); //Show first tab content
                sliderBestSeller = $('#product-tab .bestseller_carousel_tab').data("flexslider");
                sliderLast = $('#product-tab .latest_carousel_tab').data("flexslider");
            }
        });

        $featured.flexslider({
            animation: "slide",
            animationLoop: false,
            slideshow: false,
            itemWidth: 210,
            controlNav :false,
            minItems: getGridSize(), // use function to pull in initial value
            maxItems: getGridSize(), // use function to pull in initial value
            start: function (slider) {
                sliderFeatured = slider;

            }
        });

    };
    // init all action in page
    var initAction = function(){
        //Default Action
        $tabFirst.addClass("active").show(); //Activate first tab
        //On Click Event
        $tab.bind("click",function () {
            $tab.removeClass("active"); //Remove any "active" class
            $(this).addClass("active"); //Add "active" class to selected tab
            $("#product-tab .tab_content").hide();
            var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
            $(activeTab).fadeIn(); //Fade in the active content
            $(window).resize();
            return false;
        });
    }
    /******** Carousel **********/
    var initBrandSlider = function(){

        $bandSlider.jcarousel({
            vertical: false,
            visible: 5,
            scroll: 3
        });
    }
    // get grid size
    var getGridSize = function (){
        return ($window.innerWidth() < 320) ? 1 :
            ($window.innerWidth() < 600) ? 2 :
                ($window.innerWidth() < 800) ? 3 :
                    ($window.innerWidth() < 900) ? 4 : 5;
    }

    return {
        init: function () {
            initAction();

        },

        resizeItem : function(){
            var gridSize = getGridSize();
            sliderFeatured.vars.minItems = gridSize;
            sliderBestSeller.vars.minItems = gridSize;
            sliderLast.vars.minItems = gridSize;
            sliderFeatured.vars.maxItems = gridSize;
            sliderBestSeller.vars.maxItems = gridSize;
            sliderLast.vars.maxItems = gridSize;
        },

        initSlider : function(){
            initSlider();
            initBrandSlider();
        }
    };
}();
(function() {
    /* Initialize WebApp when page loads */
    $(function(){
        indexWeb.init();

        $(window).resize(function(){
            indexWeb.resizeItem();

        });

        $(window).load(function(){
            indexWeb.initSlider();
        });

        $(window).on("orientationchange",function(){
            indexWeb.resizeItem();
        });
    });
}());